<template>
  <div>
    <input
      type="checkbox"
      :checked="checked"
      @change="$emit('change', $event.target.checked)"
    />
  </div>
</template>

<script>
export default {
  // 针对这个 checkbox 来说,我们 v-model 希望收到的是 checked  change 需要配置 model 选项
  model: {
    prop: "checked", // v-model 的属性是 xxx  ,默认是 value
    event: "change", // v-model 的事件是 xxx, 默认是 input
  },

  props: ["checked"],

  methods: {
    onChange(event) {
      console.log(event.target.checked);
    },
  },

  created() {
    console.log(this, "=====");
  },
};
</script>
